package com.example.jetpackcomposebasic

import android.icu.text.RelativeDateTimeFormatter
import androidx.compose.foundation.Image
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.style.LineHeightStyle
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.core.app.NotificationCompat.Style
import coil.compose.rememberAsyncImagePainter
import coil.compose.rememberImagePainter
import kotlinx.coroutines.launch

@Preview
@Composable
fun PreviewList() {
    SimpleScrollableList()
}

@Composable
fun SimpleScrollableList() {
    /*
    * 任何UI组件的交互都是要由state对象来完成的
    * 用户滑动屏幕，state更新
    * 因为Column引用了 state对象
    * 所以Column元素显示内容会被刷新
    * */
    val rememberScrollState = rememberScrollState()
    Column(modifier = Modifier.verticalScroll(rememberScrollState)) {
        repeat(times = 100) {
            Text(text = "第#${it}个元素", style = MaterialTheme.typography.bodySmall)
        }
    }
}

@Composable
fun LazyScrollableList(rememberLazyListState: LazyListState = rememberLazyListState()) {
    //  val rememberLazyListState = rememberLazyListState()
    LazyColumn(state = rememberLazyListState) {
        items(count = 100) { // 注意这里用的是  items 函数
            Text(text = "懒加载 ${it}个元素")
        }
    }
}


@Composable
fun ButtonChangeLazyScrollableList() {

    val itemSize = 100

    // 协程作用域
    val coroutineScope = rememberCoroutineScope()
    Column {
        val state = rememberLazyListState()
        Row {
            Button(onClick = {
                coroutineScope.launch {

                    // 挂起函数只能在协程作用域里面被执行
                    state.animateScrollToItem(0)
                }
            }, Modifier.weight(1f)) {

                Text(text = "Scroll to the top")
            }
            Button(onClick = {
                coroutineScope.launch {

                    // 挂起函数只能在协程作用域里面被执行
                    state.animateScrollToItem(itemSize-1)
                }
            }, Modifier.weight(1f)) {
                Text(text = "Scroll to the bottom")
            }
        }
        LazyColumn(state = state) {
            items(count = itemSize) {
                ImageItem(it)
            }
        }
    }
}


@Composable
fun ImageItem(index: Int) {
    Row(verticalAlignment = Alignment.CenterVertically) {
        Image(
            // 下载图片依赖于 coil-compose 库
            // 访问网络需要提供 android.permission.INTERNET 权限
            painter = rememberAsyncImagePainter(model = "https://images.pexels.com/photos/16292048/pexels-photo-16292048.jpeg"),
            contentDescription = null,
            modifier = Modifier.size(50.dp)
        )
        Spacer(modifier = Modifier.size(10.dp))
        Text(text = "$index 条目", style = MaterialTheme.typography.bodyMedium)
    }
}